<%layout("/common/_layout.html"){ %>
<%#ajax userTable:{%>
<div class="am-cf am-padding">
    <div class="am-fl am-cf"><strong class="am-text-primary am-text-lg">报表中心</strong> /
        <small>V网资费变更办理清单</small>
    </div>
</div>
<div class="am-g">
    <div class="am-u-sm-12">
        <form class="am-form" id="list-form" action="${base}/vgroupZFBG/list" method="post">
            <input type="hidden" id="keywords" name="keywords" value='${keywords!""}'/>
            <input type="hidden" id="isExport" name="isExport" value='${isExport!"0"}'/>
            <table class="am-table am-table-bordered am-table-radius table-main" style="padding:0;">
                <tbody>
                <tr>
                    <th class="am-text-middle">所属机构</th>
                    <td>
                        <div class="am-u-sm-10">
                            <select data-am-selected="{btnSize:'sm',maxHeight: 400}" name="org_id" id="org_id">
                                <%for(orgNode in orgList){%>
                                <option value="${orgNode.value}"
                                <%if(org_id==orgNode.value){%>
                                selected
                                <%}%>>${orgNode.key}</option>
                                <%}%></select>
                        </div>
                    </td>
                    <th class="am-text-middle">办理时间</th>
                    <td>
                        <div class="am-u-sm-10">
                            <div class="am-form am-form-inline">
                                <div class="am-form-group am-form-icon">
                                    <i class="am-icon-calendar"></i>
                                    <input type="text" class="am-form-field am-input-sm" id="startTime"
                                           value="${startTime!}" placeholder="开始日期" data-am-datepicker>
                                </div>
                                <div class="am-form-group">至</div>
                                <div class="am-form-group am-form-icon">
                                    <i class="am-icon-calendar"></i>
                                    <input type="text" class="am-form-field am-input-sm" id="endTime"
                                           value="${endTime!}" placeholder="结束日期" data-am-datepicker>
                                </div>
                                <span style="color: red;">*默认显示最近一月数据</span>
                            </div>
                        </div>
                    </td>
                </tr>
                <tr>
                    <th class="am-text-middle">资费名称</th>
                    <td>
                        <div class="am-u-sm-10">
                            <input type="text" id="business_name" class="am-form-field am-input-sm"
                                   value="${business_name!}"/>
                        </div>
                    </td>
                    <th class="am-text-middle">资费编码</th>
                    <td>
                        <div class="am-u-sm-10">
                            <input type="text" id="business_code" class="am-form-field am-input-sm"
                                   value="${business_code!}"/>
                        </div>
                    </td>
                </tr>
                <tr>
                    <th class="am-text-middle">店员姓名</th>
                    <td>
                        <div class="am-u-sm-10">
                            <input type="text" id="user_name" class="am-form-field am-input-sm" value="${user_name!}"/>
                        </div>
                    </td>
                    <th class="am-text-middle">店员手机号</th>
                    <td>
                        <div class="am-u-sm-10">
                            <input type="text" id="user_phone" class="am-form-field am-input-sm" value="${user_phone!}"/>
                        </div>
                    </td>
                </tr>
                <tr>
                    <th class="am-text-middle">办理手机号</th>
                    <td >
                        <div class="am-u-sm-10">
                            <input type="text" id="phonenumber" class="am-form-field am-input-sm" value="${phonenumber!}"/>
                        </div>
                    </td>
                     <th class="am-text-middle">渠道编码</th>
                    <td >
                        <div class="am-u-sm-10">
                            <input type="text" id="NumCode" class="am-form-field am-input-sm" value="${NumCode!}"/>
                        </div>
                    </td>
                </tr>
                <tr>
                    <td colspan="4"> 
                        <div  align='right'>
                            <button type="button" class="am-btn am-btn-default am-btn-sm am-text-secondary"
                                    id="submit-btn">搜索
                            </button>
                            <%if(so.hasPermission("CMCC_BUSINESS_EXPORT")) {%>
                            <button type="button" class="am-btn am-btn-default am-btn-sm am-text-secondary"
                                    id="export-btn">导出
                            </button>
                            <%}%>
	                    </div>
                    </td>
                </tr>
                <tr id="download" style="display:none">
                    <td colspan="4">
                        <div align='center'>
                            <a id="downloadlink" href="#">导出成功，点击下载</a>
                        </div>
                    </td>
                </tr>
                </tbody>
            </table>
        </form>
    </div>
    <div class="am-u-sm-12 am-u-md-12" style="padding:0 1.6rem 1.6rem 1rem;margin:0;">
        <div class="am-btn-toolbar" style="padding-left:.5rem;">
        </div>
    </div>
</div>
<div class="am-g">
    <div class="am-u-sm-12">
        <div class="am-scrollable-horizontal">
            <table class="am-table am-table-striped am-table-hover table-main">
                <thead>
                <tr class="am-text-nowrap">
                    <th class="table-title">资费名称</th>
                    <th class="table-title">资费编码</th>
                    <th class="table-title">用户号码</th>
                    <th class="table-title">店员姓名</th>
                    <th class="table-title">店员手机号</th>
                    <th class="table-title">地市</th>
                    <th class="table-title">区县</th>
                    <th class="table-title">渠道编码</th>
                    <th class="table-title">渠道名称</th>
                    <th class="table-title">渠道类型</th>
                    <th class="table-title">客户经理</th>
                    <th class="table-title">办理时间</th>
                    <!--<th class="table-title">办理来源</th>-->
                </tr>
                </thead>
                <tbody>
                <%for(list in pager.list!){%>
                <tr>
                    <td>${list.business_name}</td>
                    <td>${list.business_code}</td>
                    <td>${list.phone_no}</td>
                    <td>${list.name}</td>
                    <td>${list.user_name}</td>
                    <td>${list.city}</td>
                    <td>${list.area}</td>
                    <td>${list.NumCode}</td>
                    <td>${list.DisplayName}</td>
                    <td>${list.sitetype}</td>
                    <td>${list.is_accounts_manager}</td>
                    <td>${list.create_time}</td>
                    <!--<td>${list.sale_type}</td>-->                    
                </tr>
                <%}%>
                </tbody>
            </table>
        </div>
        <div class="am-cf">

            <!-- 分页 -->
            <%if (pager.list.~size > 0){%>
            <div class="am-fr">
                <% include("/admin/common_pager.tpl"){}%>
            </div>
            <%}else{%>
            <div class="am-kai">
                <h3>没有找到任何记录!</h3>
            </div>
            <%}%>
        </div>

    </div>
</div>
<script type="text/javascript">
    $(function () {
        var keywordsObj = {};

        function setKeyWords() {
            if ($("#org_id").val())
                keywordsObj.org_id = $("#org_id").val();
            if ($("#phonenumber").val())
                keywordsObj.phonenumber = $("#phonenumber").val();
            if ($("#startTime").val())
                keywordsObj.startTime = $("#startTime").val();
            if ($("#endTime").val())
                keywordsObj.endTime = $("#endTime").val();
            if ($("#business_name").val())
                keywordsObj.business_name = $("#business_name").val();
            if ($("#business_code").val())
                keywordsObj.business_code = $("#business_code").val();
            if ($("#user_name").val())
                keywordsObj.user_name = $("#user_name").val();
            if ($("#user_phone").val())
                keywordsObj.user_phone = $("#user_phone").val();
            if ($("#NumCode").val())
                keywordsObj.NumCode = $("#NumCode").val();
          
            var $checkObj = $("input[name='isMgr']");
            for (var i = 0; i < $checkObj.length; i++) {
                if ($checkObj[i].checked) {
                    keywordsObj.isMgr = $checkObj[i].value;
                    break;
                }
            }

            var keywords = "";
            if (!$.isEmptyObject(keywordsObj)) {
                keywords = JSON.stringify(keywordsObj);
            }
            console.log("keywords = " + keywords);

            $("#keywords").val(keywords);
        }

        $("#submit-btn").on("click", function () {
            setKeyWords();
            $("#isExport").val("0");
            $("#list-form").submit();
        });

        $("#export-btn").on("click", function () {
            $('#download').hide();
            //loading层
            var index = parent.layer.load(0, {
                shade: [0.1, '#fff'] //0.1透明度的白色背景
            });
            setKeyWords();
            $("#isExport").val("1");
            //$("#list-form").submit();
            var formParam = $("#list-form").serialize();//序列化表格内容为字符串
            $.ajax({
                type: 'post',
                url: '${base}/vgroupZFBG/list',
                data: formParam,
                success: function (data) {
                    console.log(data);
                    if (data.status == 1) {
                        $('#downloadlink').text(data.message);
                        $('#downloadlink').attr('href', data.url);
                        $('#download').show();
                    } else {
                        $('#downloadlink').text(data.message);
                        $('#download').show();
                    }
                    parent.layer.close(index);
                },
                error: function () {
                    parent.layer.close(index);
                }
            });
        });
    });
</script>
<%}%>
<%}%>